<template>
  <!--vue的模板结构可以没有跟标签，-->
  <img alt="Vue logo" src="./assets/logo.png" />
  <HelloWorld msg="Hello Vue 3.0 + Vite" />
  <button @click="person.age++">修改年龄</button>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'
import {reactive,watch} from 'vue'

export default {
  name: 'App',
  components: {
    HelloWorld
  },
  setup(){
    let person = reactive({
      name:'jack',
      age:18
    })

    watch(person,(newVal,oldVal)=>{
      console.log(newVal,oldVal)
    },{immediate:true})


    return {
      person
    }

  }
}
</script>
